<template>
    <ul>
      <li class="relative pr-[29px] box-border" v-for="(item, index) in menuitems" :key="index">
        <div><span class="absolute h-full">
            <img :src="item.url.src" alt="" 
            class="inline-block mr-[12px]"
            :style="{
        width: item.size[0]+'px',
        height: item.size[1]+'px'
        }"
            />
        </span>
        <span class="pl-[30px] inline-block">{{ item.CH }}</span>
        </div>
        </li>
    </ul>
  </template>
  <script setup>
  import email from '@assets/contact/email.png';
  import map from '@assets/contact/map.png';
  import phone from '@assets/contact/phone.png';
  
  
  const menuitems = [
    {
      CH: "0571-88258302",
      size: [16,16],
      url:phone
    },
    {
      CH: "sales@einnosemi.com",
      size: [13.3,10],
      url: email
    },
    {
      CH: "浙江省杭州市滨江区西兴街道联 慧街6号2幢7F",
      size: [11,15],
      url: map
    }]
  
  </script>
  <style lang="scss" scoped>
  li {
    font-size: 14px;
    padding-top: 6px;
    padding-bottom: 4px;
    border-bottom: 1px solid #D8D8D8;
    padding-left: 16px;
    box-sizing: border-box;
    color: #3D3D3D;
    font-size: 14px;
  }
  </style>